<extJS:page name="customer" xmlns:extJS="jelly:org.richa.tags.extjs.ExtJSTagLibrary">
	<html>
	<head>
		<extJS:script />
		<extJS:style theme="ytheme-aero"/>
		<script type="text/javascript">
			function testing()
			{
				alert ("Hello World") ;
			}
		</script>
	</head>
	<body>
		<extJS:formwrapper width="650px" title="Customer Information">
			<extJS:listener name="formListener" bind="testBindHandler">
				<extJS:form name="customer" labelWidth="100" buttonAlign="left">
					<extJS:fieldset name="legper" legend="Personal">
						<extJS:textfield name="name" fieldLabel="Name" width="170" value="#{cust1.name}"/>
						<extJS:numberfield name="age" fieldLabel="Age" width="45" value="#{cust1.age}" clientClick="testing" serverChange="formHandler" sendData="field"/>
						<extJS:datefield name="dob" fieldLabel="Date Of Birth" width="100" value="#{cust1.dob}"/>
						<extJS:checkbox name="male" fieldLabel="Male" width="100"/>
					</extJS:fieldset>
					<extJS:fieldset name="legaddr" legend="Address">
						<extJS:textfield name="address1" fieldLabel="Address 1" width="170" value="#{cust1.address1}"/>
						<extJS:textfield name="address2" width="170" fieldLabel="Address2" value="#{cust1.address2}"/>
						<extJS:textfield name="city" fieldLabel="City" width="170" value="#{cust1.city}"/>
						<extJS:numberfield name="zip" fieldLabel="Zip" width="55" maxLength="5" value="#{cust1.zip}"/>
						<extJS:textarea name="comments" fieldLabel="Comments" width="170" value="#{cust1.comments}"/>
						<extJS:remotestore name="statestore" bean="test.entities.State" dataStore="statelist"/>
						<extJS:combobox name="state" minChars="1" store="statestore" triggerAction="all" selectOnFocus="true" typeAhead="true" emptyText="Select State..."  displayField="name" valueField="code" fieldLabel="State"/>
					</extJS:fieldset>
					<extJS:formbutton name="hide" text="Hide" serverClick="hideFields" sendData="page"/>
					<extJS:formbutton name="show" text="Show" serverClick="showFields" sendData="page"/>
					<extJS:formbutton name="disable" text="Disable" serverClick="disableFields" sendData="page"/>
					<extJS:formbutton name="enable" text="Enable" serverClick="enableFields" sendData="page"/>
					<extJS:formbutton name="hidefs" text="HideFS" serverClick="hideFS" sendData="page"/>
					<extJS:formbutton name="showfs" text="ShowFS" serverClick="showFS" sendData="page"/>
					<extJS:formbutton name="disablefs" text="DisableFS" serverClick="disableFS" sendData="page"/>
					<extJS:formbutton name="enablefs" text="EnableFS" serverClick="enableFS" sendData="page"/>
					<extJS:formbutton name="setfield" text="SetField" serverClick="setFields" sendData="page"/>
				</extJS:form>
			</extJS:listener>
		</extJS:formwrapper>
		<extJS:formwrapper width="700px" title="Order Information" render="#{cust1.render}">
			<extJS:form name="order" labelWidth="100">
				<extJS:column width="320px">
					<extJS:fieldset name="legord" legend="Orders">
						<extJS:textfield name="orderid" fieldLabel="Order#" width="170" />
						<extJS:datefield name="createdt" fieldLabel="Created On" width="100" />
					</extJS:fieldset>
				</extJS:column>
				<extJS:column width="320px">
					<extJS:fieldset name="legord1" legend="Orders1">
						<extJS:numberfield name="amount" fieldLabel="Amount" width="170" />
						<extJS:datefield name="shipdt" fieldLabel="Shipped On" width="100" />
					</extJS:fieldset>
				</extJS:column>
			</extJS:form>
		</extJS:formwrapper>
	</body>
	</html>
</extJS:page>